


function createBrowserHistory(){
    let globalHistory = window.history
    let state;
    let listeners = []
    function go(N){
        globalHistory.go(N)
    }
    function goBack(){
        globalHistory.back()
    }
    function goForward(){
        globalHistory.forward()
    }
    /**
     * 添加或者跳转路径
     * @param {*} pathname 路径名，可能是字符串，也可能是对象{pathname,state}
     * @param {*} nextState 
     */
    function push(pathname,nextState){
        const action = 'PUSH'
        if(typeof pathname === 'object'){
            state = pathname.state
            pathname = pathname.pathname
        }else{
            state = nextState
        }
        globalHistory.pushState(state,null,pathname)
        const location = {pathname,state}
        notify({location,action:'POP'})
    }
    function listen(listener){
        listeners.push(listener)

        return ()=>{
            listeners = listeners.filter(item=>item !== listener)
        }
    }
    window.onpopstate = () => {
        let location = { pathname: window.location.pathname, state: globalHistory.state }
        notify({ location, action: 'POP' });
    }
    function notify(newState) {
        //把newState上的属性都拷贝到history上
        Object.assign(history, newState);//newState {location,action}
        history.length = globalHistory.length;
        listeners.forEach(listener => listener({ location: history.location, action: history.action }));
    }



    const history = {
        action:"POP",
        go,
        goBack,
        goForward,
        push,
        listen,
        location:{
            pathname:window.location.pathname,
            state:window.location.state
        }
    }
    return history 
}

export default createBrowserHistory